<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
         pageEncoding="ISO-8859-1"%>

<%@taglib uri="/struts-tags" prefix="s"%>
<!doctype html>
<html lang="en" class="no-js">

    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

        <title>Government List</title>
        <meta name="description" content="">
        <meta name="author" content=""> 
		<link href="css/main.css" rel="stylesheet" type="text/css">

        <!-- Favicon -->
        <link rel="shortcut icon" type="image/x-icon" href="favicon.ico">
        <link rel="icon" type="image/png" href="favicon-large.png">

        <!-- Modernizr for support detection, all javascript libs are moved right above </body> for better performance -->
        <script src="js/libs/modernizr.custom.min.js"
        tppabs="http://www.display-inline.fr/demo/constellation/template/js/libs/modernizr.custom.min.js"></script>
        <script src="js/index.js"></script>
        <style>
            a { cursor: pointer; }
        </style>
    </head>

    <body>
        <h1><s:actionerror/></h1>
        <!-- Header -->

        <!-- Server status -->
    <header></header>
    <!-- End server status -->

    <!-- Main nav -->
    <%@include file='header.jsp'%>


    <div id="header-shadow"></div>
    <!-- End header -->

    <!-- Always visible control bar -->
    <div id="control-bar" class="grey-bg clearfix">
        <div class="container_12"></div>
    </div>
    <!-- End control bar -->

    <!-- Content -->
    <article class="container_12">

        <section class="grid_8">
            <div class="block-border">
                <form class="block-content form" id="table_form" method="get"
                        action="listGovernment" name="listGov">
                    <h1>Government List</h1>

                    <div class="block-controls">
                        <div style="text-align: right">
                                    <input type="checkbox" name="checkInclude" value="true"
                                           ${ checkInclude ? "checked" : "" }
                                           onclick="document.getElementById('table_form').submit();" />
                                    <label for="table-display" style="display: inline">Include
                                        In-active</label>
                                </div>
                        <ul class="controls-buttons">
                            <s:hidden type="hidden" id="filter" name="filter"/>
                            <s:hidden type="hidden" id="checkActive" name="checkActive"/>
                            <li><a onclick="document.getElementById('filter').value = 'all'; document.getElementById('table_form').submit();"> <strong>ALL</strong>
                                </a></li>
                            <li class="sep"></li>
                            <li><a onclick="document.getElementById('filter').value = '0-9'; document.getElementById('table_form').submit();"> <strong>0-9</strong>
                                </a></li>
                            <li><a onclick="document.getElementById('filter').value = 'ABCDE'; document.getElementById('table_form').submit();"> <strong>A B C D E</strong>
                                </a></li>
                            <li><a onclick="document.getElementById('filter').value = 'FGHIJ'; document.getElementById('table_form').submit();"> <strong>F G H
										I J</strong>
                                </a></li>

                            <li><a onclick="document.getElementById('filter').value = 'KLMN'; document.getElementById('table_form').submit();"> <strong>K L M N
                                    </strong>
                                </a></li>

                            <li><a onclick="document.getElementById('filter').value = 'OPQR'; document.getElementById('table_form').submit();"> <strong>O P Q R
                                    </strong>
                                </a></li>

                            <li><a onclick="document.getElementById('filter').value = 'STUV'; document.getElementById('table_form').submit();"> <strong>S T U V
                                    </strong>
                                </a></li>

                            <li><a onclick="document.getElementById('filter').value = 'WXYZ'; document.getElementById('table_form').submit();"> <strong>W X Y Z
                                    </strong>
                                </a></li>

                        </ul>

                    </div>
                </form>

                <s:form class="block-content form" id="table_form2" method="get"
                        action="detailGovernment" name="detailGov">
                    <div class="no-margin">
                        <s:hidden type="hidden" id="govId" name="govId"/>
                        <table class="table" id="tablepaging" cellspacing="0" width="100%">
                            <thead>
                                <tr>

                                    <th scope="col">Government Name</th>
                                    <th scope="col">Description</th>
                                    <th scope="col" class="table-actions">County Name</th>
                                    <th scope="col">Active</th>
                                </tr>
                            </thead>
                            <s:iterator value="governments" var="gov">
                                <tr>
                                    <td> <a onclick="document.getElementById('govId').value = <s:property value="govOfficeRegionID" /> ;document.getElementById('table_form2').submit();" > <s:property value="govOfficeRegionName" /> </a> </td>
                                    <td> <s:property value="description" /> </td>
                                    <td> <s:property value="countyName" /> </td>
                                    <td> <s:property value="stringActive" /> </td>
                                </tr>
                            </s:iterator>
                        </table>

                    </div>
                </s:form>


                <div class="block-footer" id="pageNavPosition">
                    <script type="text/javascript">
                        var pager = new Pager('tablepaging', 5);
                        pager.init();
                        pager.showPageNav('pager', 'pageNavPosition');
                        pager.showPage(1);
                    </script>
                </div>


            </div>
        </section>




        <div class="clear"></div>

    </article>

    <!-- End content -->

    <footer>



    </footer>
</body>
</html>